<template>
	<view class="content bg-white">
		<!-- 导航条 -->
		<nav-bar></nav-bar>
		<!-- 轮播图 -->
		<!-- #ifndef APP-NVUE || MP-TOUTIAO -->
		<view class="u-demo-block">
			<u-swiper :list="list3" previousMargin="30" nextMargin="30" circular :autoplay="false" radius="5"
				bgColor="#ffffff"></u-swiper>
		</view>
		<!-- #endif -->
		<!-- 推荐bar -->
		<recommend-bar title="本季推荐" class="margin-bottom-sm"></recommend-bar>
		<!-- 商品列表 -->
		<view class="goos-list padding-sm flex flex-wrap justify-between">
			<view @click="handleDetail(index)" class="margin-bottom-sm " v-for="(item,index) in cakeList" :key="index">
				<goods-item :imageUrl="item.imageUrl" :title="item.title" :subtitle="item.subtitle"
					:price="item.price"></goods-item>
			</view>
		</view>
		<!-- 加载信息 -->
		<view class="text-center">
			<view v-if="!showBottomTittle">
				正在加载。。。
			</view>
			<view v-else>
				没有更多
			</view>
		</view>
		<!-- 返回顶部 -->
		<view class="wrap">
			<u-back-top :scroll-top="scrollTop"></u-back-top>
		</view>
	</view>
</template>

<script>
	import RecommendBar from './components/recommend-bar/recommend-bar.vue'
	export default {
		components: {
			RecommendBar
		},
		data() {
			return {
				scrollTop: 0,
				showBottomTittle: false,
				list3: [
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
				],
				cakeList: [{
						imageUrl: "/static/cakeImage/cake1.webp",
						title: "非常好吃的蛋糕",
						subtitle: "very delicious cake",
						price: 100
					},
					{
						imageUrl: "/static/cakeImage/cake2.webp",
						title: "南京好吃的蛋糕",
						subtitle: "very delicious cake",
						price: 200
					},
					{
						imageUrl: "/static/cakeImage/cake3.webp",
						title: "北京好吃的蛋糕",
						subtitle: "very delicious cake",
						price: 300
					},
					{
						imageUrl: "/static/cakeImage/cake4.webp",
						title: "河北好吃的蛋糕",
						subtitle: "very delicious cake",
						price: 400
					},
					{
						imageUrl: "/static/cakeImage/cake4.webp",
						title: "河北好吃的蛋糕",
						subtitle: "very delicious cake",
						price: 400
					},
					{
						imageUrl: "/static/cakeImage/cake4.webp",
						title: "河北好吃的蛋糕",
						subtitle: "very delicious cake",
						price: 400
					}
				]
			}
		},
		onLoad() {

		},
		methods: {
			handleDetail(index) {
				uni.navigateTo({
					url: `/pages/goodsDetail/goodsDetail?id=${index}`
				})
			}
		},
		onReachBottom() {
			// uni.showToast({
			// 	title:"11"
			// })
			if (this.cakeList.length < 20) {
				setTimeout(() => {
					this.cakeList.push(this.cakeList[uni.$u.random(0, 3)])
					this.cakeList.push(this.cakeList[uni.$u.random(0, 3)])
				}, 700);
			} else {
				this.showBottomTittle = true
			}
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		}
	}
</script>

<style lang="scss">
	// .navbar{
	// 	.title{
	// 		font-weight: 900;
	// 	}
	// }
</style>